<template>
  <view class="main">
    <view class="header" style="background-color: #fc872d;color: #fff;padding: 50rpx 30rpx;">
			<view class="">
        <text style="margin-top: 20rpx;font-size: 48rpx;">{{storeInfo?.title}}</text>
        
			</view>
			<view class="">
        <text>余额</text>
        <text style="margin-left: 10rpx; margin-top: 20rpx;font-weight: 700;font-size: 60rpx;">{{storeInfo?.money||'0.00'}}</text>
        <text style="margin-left: 10rpx;">元</text>
			</view>
		</view>

		<view class="content">
			<view class="tongji" style="font-size: 28rpx;color: #999;margin-top: 30rpx;">
				转移到
			</view>
			<view class="chongzhi-box" style="margin-top: 20rpx;margin-top: 20rpx;">
        <view class="select" @click="handleSelect">
          <view v-if="currentStore.id">{{currentStore.name}}</view>
          <view v-else class="placeholder">请选择目标门店</view>
        </view>
			</view>
			<view class="tongji" style="font-size: 28rpx;color: #999;margin-top: 30rpx;">
				转移金额（元）
			</view>
			<view class="chongzhi-box" style="margin-top: 20rpx;margin-top: 20rpx;">
				<up-input type="number" placeholder="请输入转移金额" v-model="formData.money1" style="background-color: #fff;border: 1px solid #eee;font-size: 32rpx;font-weight: 700;padding: 20rpx 20rpx;box-sizing: border-box;height: 90rpx;"></up-input>
			</view>
			<view class="tongji" style="font-size: 28rpx;color: #999;margin-top: 30rpx;">
				确认转移金额（元）
			</view>
			<view class="chongzhi-box" style="margin-top: 20rpx;margin-top: 20rpx;">
				<up-input type="number" placeholder="请输入转移金额" v-model="formData.money2" style="background-color: #fff;border: 1px solid #eee;font-size: 32rpx;font-weight: 700;padding: 20rpx 20rpx;box-sizing: border-box;height: 90rpx;"></up-input>
			</view>
      
      <up-button type="warning" style="margin-top: 50rpx;" @click="handleConfirm">确认转移</up-button>
		</view>
		<!-- 转移资产 -->
    <com-store-popup ref="storePopupRef" @confirm="handleSelectConfirm"></com-store-popup>
    
  </view>
</template>

<script lang="ts" setup>
import { ref } from 'vue';
import ComStorePopup from './com-store-popup.vue';
import { getStoreInfoApi, transferStoreMoneyApi } from '@/addon/htscrm/api';
import useAdminStore from '@/addon/htscrm/stores/admin';
import { onLoad } from '@dcloudio/uni-app';
import { debounce } from '@/utils/common';

const adminStore = useAdminStore()
const formData = ref<any>({
  store_id: '',
  money1: '',
  money2: ''
})
const storeInfo = ref<any>({})
const currentStore = ref<any>({})
const storePopupRef = ref()


onLoad(async () => {
	await getData()
})

async function getData() {
	const res = await getStoreInfoApi()
	storeInfo.value = res.data
}

function handleSelect() {
  storePopupRef.value.open(currentStore.value)
}
function handleSelectConfirm(e:any) {
  currentStore.value = e
	formData.value.store_id = e?.id
}

const handleConfirm = debounce(async() => {
	if(!formData.value.store_id) {
		uni.showToast({title:'请选择门店',icon:"none"})
		return false
	}
	if(!formData.value.money1) {
		uni.showToast({title:'请输入金额',icon:"none"})
		return false
	}
	if(formData.value.money1 !== formData.value.money2) {
		uni.showToast({title:'两次输入金额不一致',icon:"none"})
	}

	// 金额是正整数
	if(!/^[1-9]\d*$/.test(formData.value.money1)) {
		uni.showToast({title:'金额必须为正整数',icon:"none"})
		return false
	}

	// 确认转移
	if(Number(formData.value.money1) > Number(storeInfo.value.money)) {
		uni.showToast({title:'余额不足，请重新输入转移金额',icon:"none"})
		return false
	}

	const params:any = {
		to_store_id: formData.value.store_id,
		money: formData.value.money1,
	}
	const storeId = adminStore.getUserInfo().store_id
	if(storeId) {
		params.from_store_id = storeId
	}

	const res = await transferStoreMoneyApi(params)
	if(res.code === 1) {
		uni.showToast({title:'转移成功',icon:"none"})
		getData()
	}
})
</script>


<style scoped lang="scss">
	page {
		background-color: #f5f5f5;
	}
	.content{
		padding: 30rpx;
	}
	.select {
    width: 100%;
    position: relative;
    background-color: #fff;border: 1px solid #eee;font-size: 32rpx;font-weight: 700;padding: 20rpx 20rpx;box-sizing: border-box;height: 90rpx;
    .placeholder {
      color: #999;
    }
  }
</style>